<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/public/libs/jquery.min.js"></script>
    <script src="/public/plugins/echarts/echarts.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //1,初始化echarts
            var myEcharts = echarts.init(document.getElementById("myPieContainner"));
            //2.初始化配置和数据
            var option = {
                title : {
                    text: '千锋集团部门员工统计',
                    subtext: '2019年3月统计',
                    x:'center'
                },
                tooltip : {
                    trigger: 'item',
                    formatter: "{a} <br/>{b} : {c} ({d}%)"
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    //data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
                    data:[]
                },
                series : [
                    {
                        name: '访问来源',
                        type: 'pie',
                        radius : '55%',
                        center: ['50%', '60%'],
                        // data:[
                        //     {value:335, name:'直接访问'},
                        //     {value:310, name:'邮件营销'},
                        //     {value:234, name:'联盟广告'},
                        //     {value:135, name:'视频广告'},
                        //     {value:1548, name:'搜索引擎'}
                        // ],
                        data:[],
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };

            $.get("/sys/echarts/pie",function(r){
                var  legendData = r.legendData;//data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
                var seriesData = r.pieData;

                //把真数据赋值给option
                option.legend.data = legendData;
                option.series[0].data = seriesData;

                //3,设置option
                myEcharts.setOption(option);
            });
        });


    </script>
</head>
<body>
    <!--容器-->
<div style="width:600px;height:500px;" id="myPieContainner">
</div>

</body>
</html>